<form method="post" action="{:Url('GoodsStore/changeSort')}">
    <table class="table table-hover">
        <thead>
            <tr>
                <th class="hide">排序</th>
                <th>名称</th>
                <th>图片</th>
                <th>普通价格</th>
                <th>库存数量</th>
                <th>卖出数量</th>
                <th>借出数量</th>
                <th>收入金额</th>
                <th class="hide">上架</th>
                <th>操作</th>
            </tr>
        </thead>
        <tbody>
            {foreach name="goodsList" item="item"}
            <tr>
                <td class="hide">
                    <input type="hidden" name="goods_id[]" value="{$item.goods_id}">
                    <input type="hidden" name="id[]" value="{$item.id}">
                    <input type="text" name="sort[]" class="form-control" style="width:60px;text-align:center" value="{$item.sort}">
                </td>
                <td>{$item.goods_name}</td>
                <td style="position: relative;">
                    <img src="{$item.image}" alt="" class="goods-image" height="34px">
                    <div style="position:absolute;top:0;left:65px;display:none;border: 1px solid #ccc;">
                        <img src="{$item.image}" alt="" style="max-width: 500px">
                    </div>
                </td>
                <td>￥{$item.price}</td>
                <td>{$item.store_count}</td>
                <td>{$item.sales_sum}</td>
                <td>{$item.hire_sum}</td>
                <td>{$item.amount_sum}</td>
                <td class="hide">
                    {if condition="$item['is_on_sale'] eq 1"}
                    <a href="javascript:;" data-id="{$item.id}" data-field="is_on_sale" class="toggleStatus fa fa-check-circle text-info"
                        style="font-size: 3rem;"></a>
                    {else/}
                    <a href="javascript:;" data-id="{$item.id}" data-field="is_on_sale" class="toggleStatus fa fa-times-circle text-danger"
                        style="font-size: 3rem;"></a>
                    {/if}
                </td>
                <td>
                    <a href="#" class="btn btn-success btn-xs set_store_count" data-id='{$item.id}' data-store-count='{$item.store_count}'>设置库存</a>
                </td>
            </tr>
            {/foreach}
        </tbody>
    </table>
    <button type="submit" class="btn btn-warning">更新排序</button>
</form>

<div class="row page">
    <div class="col-sm-12 text-center">
        {$page}
    </div>
</div>

<script>
    $(".page a").click(function () {
        ajax_index($(this).data('p'));
    });
    $('.toggleStatus').click(function () {
        var obj = $(this);
        var id = obj.data('id');
        var field = obj.data('field');
        var status = obj.hasClass('fa-check-circle') ? 2 : 1; //sale:1切换到上架，2切换到下架
        $.ajax({
            url: "{:Url('GoodsStore/toggleStatus')}",
            type: 'get',
            data: { id: id, field: field, status: status },
            success: function (res) {
                if (res > 0) {
                    if (status == 1) {
                        obj.attr('class', 'toggleStatus fa fa-check-circle text-info');
                    } else if (status == 2) {
                        obj.attr('class', 'toggleStatus fa fa-times-circle text-danger');
                    }
                    layer.msg('操作成功');
                } else {
                    layer.msg('操作失败');
                }
            }
        })
    });
    $('.set_store_count').click(function () {
        var id = $(this).attr('data-id');
        var store_count = $(this).attr('data-store-count');
        $('#old_store_count').text('(目前库存：' + store_count + ')');
        $('#goods_store_id').val(id);
        // 显示模态框
        $('#myModal').modal('show');
    });
    $('.goods-image').mouseover(function () {
        $(this).next().show();
    }).mouseout(function () {
        $(this).next().hide();
    });
</script>